{% extends 'base.html' %}
{% load msnaktags %}

{% block title %}{% if editing %}Editing {% endif %}'{{ file_name }}' Details{% endblock %}

{% block css %}
<style type="text/css">
    .filedetails > div {
        margin:0.5em;
    }
    h2 {
        font-size:1em;
        display:inline;
    }
    .filepreview {
        float: right;
        border: solid black 1px;
        width: 200px;
        text-align: center;
    }
    .previewimg {
        max-width: 200px;
        max-height: 150px;
        vertical-align: middle;
    }
    .imgwrap {
        height: 150px;
        line-height: 150px;
    }
    span.entry {}
    input.entry {}
    .isnull {
        color: SeaGreen;
    }
    .red:hover {
        color: red;
    }
    .downloadlink{
        margin: 0 auto;
        width: 100%;
        border-top: solid thin #ccc;
    }
</style>
{% endblock %}

{% block sidebar %}
<form action="/file-details" method="GET">
    <input type="hidden" name="fileid" value="{{ file_id }}">
    <input type="hidden" name="edit" value="{{ editing|yesno:"false,true" }}">
    <input type="submit" value="{%if editing%}Discard Changes{%else%}Edit Details...{%endif%}">
</form>
<hr>
<form action="/delete" method="POST">
    {% csrf_token %}
    <input type="submit" value="Delete File..." class="red">
    <input type="hidden" name="fileid" value="{{ file_id }}">
</form>
{% endblock %}

{% block content %}
{% if editing %}
<form method="POST">
    {% endif %}
    <div class="filedetails">
        <div class="filepreview">
            <div class="imgwrap"><img src="{{ file_id|thumbnail_url }}" class="previewimg" alt="{{ file_name }} preview"></div>
            {% if not editing %}
            <form class="downloadlink" action="/download" method="GET">
                <input type="hidden" name="fileid" value="{{ file_id }}">
                <input type="submit" value="Download File">
            </form>
            {% endif %}
        </div>
        {# The detail_item custom tag is defined in msnak/templatetags/msnak.py #}
        {# The template it uses is located at msnak/templates/filedetailitem.html #}
        {% detail_item "title" "Title" 1 %}
        {% detail_item "name" "Filename" %}
        {% detail_item "category" "Category" %}
        {% detail_item "upload_time" "Uploaded" %}
        {% detail_item "viewcount" "Total Views" %}
        {% detail_item "tags" "Tags" 1 %}
        {% detail_item "comment" "Comment" 2 %}
        {% if editing %}
        {% csrf_token %}
        <input type="submit" name="submit_changes" value="Save Changes">
        {% endif %}
    </div>
{% if editing %}
</form>
{% endif %}
{% endblock %}
